<template>

  <v-dialog persistent v-model="currentVal" max-width="290">
    <v-card>
      <v-card-title class="justify-center">{{msg}}</v-card-title>
      <v-divider></v-divider>
      <v-card-actions v-show="type==='confirm'">
        <v-btn :ripple="false" block color="green darken-1" text @click="currentVal = false"> 确定</v-btn>
      </v-card-actions>
    </v-card>
  </v-dialog>

</template>

<script>
    export default {
        mounted() {
            this.$bus.$on('xy_inner_bus_alert_on', (notice) => {
                this.id = notice.id;
                this.currentVal = true;
                this.msg = notice.message;
                this.type = notice.type || 'simple';

                //自动关掉提示
                if (this.type === 'simple') {
                    setTimeout(() => {
                        this.currentVal = false;
                    }, 1500)
                }
            });
        },
        props: {
            message: {
                type: String,
                default: 'Alert'
            },
            value: {
                type: Boolean,
                default: false
            }
        },
        data() {
            return {
                id: null,
                currentVal: this.value,
                msg: this.message,
                type: 'simple' // simple | confirm
            }
        },
        methods: {},
        watch: {
            currentVal(val) {
                // this.$emit('input', val);

                if (!val) {
                    this.$bus.$emit('xy_inner_bus_alert_off', {
                        id: this.id
                    });
                }

            },
            // value(val) {
            //     this.currentVal = val;
            // }
        },
        destroyed() {
            this.$bus.$off('xy_inner_bus_alert_on');
        }
    }
</script>
